<template>
  <div class="treatment dialog-patient">
    <el-card class="box-card">
      <div slot="header" class="clearfix">
        <span>患者病例信息</span>
      </div>
      <el-row class="text item">
        <el-col :span="12">患者姓名：{{ patientMsg.patientName }}</el-col>
        <el-col :span="12">患者编号：{{ patientMsg.patientId }}</el-col>
        <el-col
          :span="12"
        >患者性别：{{ dict.label.gender[patientMsg.patientGender] }}</el-col>
        <el-col :span="12">病例编号：{{ patientMsg.id }}</el-col>
        <el-col :span="12">主治医生：{{ patientMsg.doctorName }}</el-col>
        <el-col
          :span="12"
        >订单状态：{{ dict.label.order_stat[patientMsg.orderStat] }}</el-col>
        <el-col :span="12">套餐名称：{{ patientMsg.packageName }}</el-col>
        <el-col :span="12">订单时间：</el-col>
        <el-col :span="12">套餐状态：{{ patientMsg.packageStat }}</el-col>
        <el-col :span="12">矫治器名称：{{ patientMsg.productName }}</el-col>
        <el-col :span="12">诊疗阶段：{{ patientMsg.phase }}</el-col>
        <el-col :span="12">诊疗状态：{{ patientMsg.recordStat }}</el-col>
        <el-col :span="12">病例时间：</el-col>
        <el-col :span="12">物流状态：</el-col>
      </el-row>
    </el-card>
    <el-form v-if="curType === 0" ref="reason" :model="stopTreatment">
      <p class="contitle">停治原因</p>
      <p class="info">创建于：{{ parseTime(patientMsg.createDate) }}</p>

      <el-form-item
        prop="reason"
        :rules="[
          { required: true, message: '请输入停治原因', trigger: 'blur' },
        ]"
      >
        <el-input
          v-model="stopTreatment.reason"
          type="textarea"
          :rows="2"
          placeholder="请输入内容"
        ></el-input>
      </el-form-item>
      <p class="contitle">结算</p>
      <p class="info">
        账单结算金额：

        <el-form-item
          prop="settleAmount"
          :rules="[
            { required: true, message: '请输入账单结算金额', trigger: 'blur' },
          ]"
        ><el-input-number
          v-model="stopTreatment.settleAmount"
          class="numInput"
          size="mini"
          controls-position="right"
          :min="1"
        ></el-input-number>元
        </el-form-item>
      </p>
      <el-form-item
        prop="settleRemark"
        :rules="[
          { required: true, message: '请输入结算说明', trigger: 'blur' },
        ]"
      ><el-input
        v-model="stopTreatment.settleRemark"
        type="textarea"
        :rows="2"
        placeholder="结算说明"
      ></el-input>
      </el-form-item>
    </el-form>
    <el-form v-else-if="curType === 1" ref="reason" :model="cancelAppliance">
      <p class="contitle">取消制作原因</p>
      <el-form-item
        prop="reason"
        :rules="[
          { required: true, message: '请输入取消制作原因', trigger: 'blur' },
        ]"
      >
        <el-input
          v-model="cancelAppliance.reason"
          type="textarea"
          :rows="2"
          placeholder="请输入内容"
        ></el-input>
      </el-form-item>
      <p class="tipError">
        <i class="el-icon-warning"></i> 请通知医生寄回矫治器
      </p>
    </el-form>
    <el-form v-else-if="curType === 2" ref="reason" :model="changeAppliance">
      <p class="contitle">重新选择矫治器原因</p>

      <el-form-item
        prop="reason"
        :rules="[
          { required: true, message: '请输入重选矫治器原因', trigger: 'blur' },
        ]"
      >
        <el-input
          v-model="changeAppliance.reason"
          type="textarea"
          :rows="2"
          placeholder="请输入内容"
        ></el-input>
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button type="primary" @click="reasonSubmit(curType)">确认</el-button>
      <el-button @click="close(false)">取消</el-button>
    </div>
  </div>
</template>
<script>
import { crud } from '@crud/crud';
import { parseTime } from '@/utils/index';
import { queryPatientPut } from '@/api/operPatient';
export default {
  mixins: [crud()],
  dicts: ['gender', 'order_stat'],
  props: {
    curType: {
      type: Number,
      default: 0
    }
  },
  data() {
    return {
      patientMsg: {},
      textarea: '',
      // 停止治疗
      stopTreatment: {
        reason: '',
        settleAmount: '',
        settleRemark: '',
        medicalRecordId: ''
      },
      // 取消
      cancelAppliance: {
        reason: '',
        medicalRecordId: []
      },
      // 重选
      changeAppliance: {
        reason: '',
        medicalRecordId: []
      }
    };
  },
  mounted() {
    this.patientMsg = this.crud.selections[0];
    this.stopTreatment.medicalRecordId = this.patientMsg.id;
    this.cancelAppliance.medicalRecordId = this.patientMsg.id;
    this.changeAppliance.medicalRecordId = this.patientMsg.id;
  },
  methods: {
    parseTime,
    close(v) {
      this.$emit('closeDialog', v);
    },
    reasonSubmit(type) {
      let url = '';
      let params = {};
      this.$refs['reason'].validate((valid) => {
        if (valid) {
          // 0：停治，1：取消矫治器，2:重选矫治器
          if (type === 0) {
            url = 'medicalRecord/terminate';
            params = this.stopTreatment;
          } else if (type === 1) {
            url = 'medicalRecord/cancelAppliance';
            params = this.cancelAppliance;
          } else if (type === 2) {
            url = 'medicalRecord/changeAppliance';
            params = this.changeAppliance;
          }
          queryPatientPut(url, params)
            .then((res) => {
              this.crud.submitSuccessNotify();
              this.close(true);
            })
            .catch((er) => {});
        } else {
          return false;
        }
      });
    }
  }
};
</script>
<style lang="scss">
.treatment {
  .el-card .el-col {
    color: #508fcc;
    margin-bottom: 15px;
  }
  .contitle {
    padding-left: 6px;
    border-left: 3px #508fcc solid;
    color: #333;
    margin-top: 32px;
  }
  .info {
    font-size: 12px;
    color: #666666;
  }
  .numInput {
    margin-right: 10px;
  }
  textarea {
    min-height: 120px !important;
  }
  .tipError {
    color: #ea5f5f;
  }
}
</style>
